<template>
	<view class="" style="display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;">
		<view class="content" @tap="detail(item.id)" v-for="item in list">
		<view class="image">
			<image :src="item.banner" style="width: 330rpx;height: 200rpx;border-radius: 10rpx;" mode="aspectFill"></image>
		</view>
		<view class="text">
			{{item.name}}
		</view>
		<view class="price">
			<view class="icon">
				￥
			</view>
			<view class="">
				{{item.price}}
			</view>
		</view>
	</view>
	</view>
	
</template>

<script setup lang="ts">
	import { reactive, ref } from 'vue'
		import tools from '@/utils/tools'
	import { onLoad, onShareAppMessage, onShareTimeline,onReachBottom } from '@dcloudio/uni-app'
	const props = defineProps({
		list:{type:Array as any}
	})
	const detail = (id)=>{
		tools.navTo('/pagesA/project/detail?id=' + id)
	}
</script>

<style lang="scss" scoped>
	.content{
		position: relative;
		margin-bottom: 20rpx;
		width: 330rpx;
		 
		.text{
			margin-top: 20rpx;
			text-overflow: ellipsis;
			overflow: hidden;
			line-clamp: 2;
			-webkit-line-clamp: 2;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			height: 76rpx;
		}
		.price{
			color: #F00505;
			font-weight: bold;
			display: flex;
			align-items: flex-end;
			margin-top: 10rpx;
			.icon{
				font-size: 22rpx;
					line-height: 1.5;
			}
			.text{
				font-size: 32rpx;
			}
		}
	}
	 
</style>